<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>computed Option 计算选项</title>
	<script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
	<h1>computed Option 计算选项</h1>
	<hr>
	<div id="app">
		<p>{{newPrice}}</p>
        <p>{{price}}</p>
        <ul>
			<li v-for="item in reversNews">
				{{item.title}}---{{item.date}}
			</li>
        </ul>
	</div>
    

</body>
<script type="text/javascript">
var newList=[
	{title:'弘扬优良家风，习近平这些话深入人心',date:'2019/3/23'},
	{title:'中央督察组点名2省假装整改：竟登报正面宣传',date:'2019/4/23'},
	{title:'史上首次！威尔士大游行要求独立 有人因"脱欧"态度转变',date:'2019/3/25'},
	{title:'中央政法委评上饶小学案：法治社会，绝不许以爱之名施暴',date:'2019/3/27'},
	{title:'9名厅官受处分！河北违建别墅问题有结果了',date:'2019/3/20'},
	{title:'全国唯一一位女省委秘书长，多了新头衔',date:'2019/1/23'}
]

var app = new Vue({
	el:'#app',
	data:{
		price:100,
		newList:newList
	},
	computed:{
		newPrice:function () {
			return '￥'+this.price+'元';
		},
		reversNews:function () {
			// reverse 倒序
			return this.newList.reverse();
		}
	}
})

</script>
</html>